<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>瀑布流效果特效代码</title>
	<script src="js/jquery-3.4.1.js"></script>
	<script src="js/jquery.lazyload1.9.1.min.js"></script>

	<script  src="js/index3.js"></script>
    <style type="text/css">
        /* 标签重定义 */
        body{padding:0;margin:0;}
        img{border:none;}
        a{text-decoration:none;color:#444;}
        a:hover{color:#999;}
        #title{width:600px;margin:20px auto;text-align:center;}
       
        /* wrap */
        #wrap{width:auto;height:auto;margin:0 auto;position:relative;}
        #wrap .box{width:280px;height:auto;padding:10px;border:none;float:left;}
        #wrap .box .info{width:280px;height:auto;border-radius:8px;box-shadow:0 0 11px #666;background:#fff;}
        #wrap .box .info .pic{width:260px;height:auto;margin:0 auto;padding-top:10px;}
        #wrap .box .info .pic img{width:260px;border-radius:3px;}
        #wrap .box .info .title{width:260px;height:40px;margin:0 auto;line-height:40px;text-align:center;color:#666;font-size:18px;font-weight:bold;overflow:hidden;}
	
    </style>
</head>
<body>
<section id="title">
    <h2>js瀑布流效果特效代码</h2>
</section>

<div id="wrap">
	
    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/1.jpg"></div>
            <div class="title"><a href="www.baidu" target="_blank"> 瀑布流效果</a></div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/2.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/3.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/4.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/5.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/6.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/7.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/8.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/9.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>

    <div class="box">
        <div class="info">
            <div class="pic"><img src="images/10.jpg"></div>
            <div class="title">瀑布流效果</div>
        </div>
    </div>



</div>
<footer class="hide" >
	<h2>已经到底了...</h2>
</footer>

</body>
</html>
